
<template>
<p class="navbox">
<img style="height: 62px;" src="../../../images/logo.png" alt="">
  
  <el-menu
  :default-active="activeIndex2"
  class="el-menu-demo"
  mode="horizontal"
  @select="handleSelect"
  background-color="#fff"
  text-color="#000"
  active-text-color="#00f">

  <el-menu-item index="1" @click="togo('index')">首页</el-menu-item>
  <el-menu-item index="2" @click="togo('shijuan')">试卷中心</el-menu-item>
  <el-menu-item index="3" @click="togo('shiping')">视频课堂</el-menu-item>
  <el-menu-item index="4" @click="togo('xunlian')">智能训练</el-menu-item>
  <el-menu-item index="5" @click="togo('jilu')">考试记录</el-menu-item>
  <el-menu-item index="6" @click="togo('cuoti')">错题本</el-menu-item>
  <el-submenu index="2">
    <template slot="title"><img class="navicon" src="../../../images/navicon.png" alt=""></template>
    <el-menu-item index="2-1">个人中心</el-menu-item>
    <el-menu-item index="2-2">消息中心</el-menu-item><hr>
    <el-menu-item index="2-3">退出</el-menu-item>
  </el-submenu>

</el-menu>
<!-- <router-view></router-view> -->

</p>


</template>

<script>
export default {
    data() {
      return {
        activeIndex: '1',
        activeIndex2: '1'
      };
    },
    methods: {
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },
      togo: function (value) {
      this.$router.push(value);
    },

    }

}
</script>

<style lang="scss" scoped>
*{
    margin: 0;
    padding: 0;
}

.navbox{
    // background-color: #eaa1a1;
    display: flex;
    justify-content: space-between;
}
.navicon{
    width: 40px;
    height: 40px;
}



</style>